import { createRouter, createWebHistory, type RouteRecordRaw } from 'vue-router'
import type { App } from "vue";

export const Layout = () => import('@/layout/index.vue')


// [
//   {
//     path: '/',
//     name: 'home',
//     component: () => import('@/views/HomeView.vue'),
//   },
//   {
//     path: '/login',
//     name: 'login',
//     // route level code-splitting
//     // this generates a separate chunk (About.[hash].js) for this route
//     // which is lazy-loaded when the route is visited.
//     component: () => import('@/components/home/LoginDialog.vue'),
//   },{
//   path: '/doc_list',
//   name: 'doc_list',
//   // route level code-splitting
//   // this generates a separate chunk (About.[hash].js) for this route
//   // which is lazy-loaded when the route is visited.
//   component: () => import('@/views/doc_list.vue'),
// },
// ],

export const constantRoutes: RouteRecordRaw[] = [
  {
    path: "/redirect",
    component: Layout,
    meta: { hidden: true },
    children: [
      {
        path: "/redirect/:path(.*)",
        component: () => import("@/views/redirect/index.vue"),
      },
    ],
  },
  {
    path: '/',
    component: Layout,
    redirect: '/home',
    children: [
      {
        path: 'home',
        name: 'home',
        component: () => import('@/views/HomeView.vue')
      },
      {
        path: 'doc_list',
        name: 'doc_list',
        component: () => import('@/views/DocList.vue'),
        props: route => ({ id: route.query.id ?? '' }) // query 方式
      },
      {
        path: 'doc_view/:id',
        name: 'doc_view',
        component: () => import('@/views/DocView.vue'),
        props: true
      },
    ]
  }
]


const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: constantRoutes,
  // 刷新时，滚动条位置还原
  scrollBehavior: () => ({ left: 0, top: 0 }),
})

// 全局注册 router
export function setupRouter(app: App<Element>) {
  app.use(router);
}

export default router
